<template>
  <div class="add-customer">
    <customer-form ref="customerFormRef" type="add" :form="form">
      <template #title>
        <Title title="客户信息录入" />
      </template>
    </customer-form>
    <cus-distribute ref="distributeFormRef">
      <template #title>
        <Title title="分配动作" />
      </template>
    </cus-distribute>
  </div>
</template>

<script lang="ts">
import { defineComponent, getCurrentInstance } from 'vue'
import customerForm from '@app/customer/components/customer-form.vue'
import cusDistribute from '@app/customer/components/distribute/add-distribute.vue'
import Title from '@app/customer/components/title.vue'
export default defineComponent({
  name: 'AddCustomer',
  components: { customerForm, Title, cusDistribute },
  props: {
    form: {
      type: Object,
      default: () => ({})
    }
  },
  setup() {
    const instance: any = getCurrentInstance()

    // 客户录入信息校验
    const checkForm = () => {
      return instance?.refs.customerFormRef.isCheckForm()
    }

    // 分配校验
    const checkDisForm = () => {
      return instance?.refs.distributeFormRef.check()
    }

    return {
      checkForm,
      checkDisForm
    }
  }
})
</script>

<style lang="stylus" scoped>
:deep(.memo)
  margin-left 24px !important
:deep(.el-radio__label), :deep(.el-checkbox__label)
  max-width 200px
  overflow hidden
  text-overflow ellipsis
  white-space nowrap
:deep(.el-cascader__tags) // 级联标签的最大宽度
  .el-tag__content
    max-width 50px
.add-customer
    :deep(.el-form-item)
      width calc(50% - 24px)
      margin-right 24px !important
      &.pairs, &.datetime-range, &.attachment
        width 100%
        &.pairs
          margin-right 0 !important
</style>
